import React, { Component } from 'react';
import { View, Image, TouchableOpacity, Dimensions, Text, Modal, ScrollView, TextInput, Alert, KeyboardAvoidingView } from 'react-native';
import api from '../../../../utils/api';
import { Toast, Flex } from 'antd-mobile-rn';
const window = Dimensions.get("window");
export default class CardDetail extends Component {

    static navigationOptions = ({ navigation }) => {
        // console.log("e::",e);
        const onSaveClick = navigation.getParam("onSaveClick", () => { });
        return {
            title: "答题卡",
            headerRight: (
                <View>
                    <TouchableOpacity
                        style={{
                            width: 65,
                            height: 30,
                            backgroundColor: "#E6E6E6",
                            borderRadius: 4,
                            alignItems: "center",
                            justifyContent: "center",
                            marginRight: 15
                        }}
                        onPress={() => {
                            onSaveClick();
                        }}
                    >
                        <Text style={{
                            // padding:10,
                            color: "#1E1F44",
                            fontSize: 14
                        }}>保存</Text>
                    </TouchableOpacity>

                </View>
            )
        }
    }

    state = {
        projects: [],
        firstValue: null,
        secendValue: null,
        thirdValue: null,
        show: false,
        dataList: [],
        dataType: "",
        sections: [],
        sectionMap: {},
        selectNoMap: {},
        startMap: {},
        notesMap: {},
        showBzModal: false,
        currentInfo: null,
        noteText: "",
        dataMap: {},
        isOpenDetail: false

    }



    componentDidMount() {


        this.initPracticeNodes();

        const { navigation } = this.props;

        navigation.setParams({
            onSaveClick: () => {
                this.saveCard();
            }
        });
        console.log(this.props)


    }

    saveCard = () => {
        const { cardId, sections, selectNoMap, startMap, notesMap, userAnswerCardId } = this.state;
        const { navigation } = this.props;

        Alert.alert("确认答案输入无误?", "提交后将生成对应分数", [
            { text: "再检查下" },
            {
                text: "确认提交", onPress: () => {


                    Toast.loading("保存中...", 0);

                    const data = [];

                    sections.forEach(s => {
                        s.answerCardDataVoList.forEach(item => {
                            data.push(item);
                        });
                    });

                    const userErrorAnswerDatas = data.map(item => {
                        const d = {
                            errorStatus: 0,
                            qCategoryId: item["qCategoryId"],
                            // qKey: item["qKey"],
                            qNo: item["qNo"],
                            pointStatus: 0,
                            notes: ""

                        };
                        Object.keys(selectNoMap).forEach(k => {
                            const nomap = selectNoMap[k];
                            if (nomap[item.qNo]) {
                                d.errorStatus = 1;
                            }
                        });

                        Object.keys(startMap).forEach(k => {
                            const smap = startMap[k];
                            if (smap[item.qNo]) {
                                d.pointStatus = 1;
                            }
                        });
                        Object.keys(notesMap).forEach(k => {
                            const smap = notesMap[k];
                            if (smap[item.qNo]) {
                                d.notes = smap[item.qNo];
                            }

                        });

                        return d;

                    });




                    api({
                        url: "/examRecord/saveAnswer",
                        method: "PUT",
                        body: {
                            cardId: cardId,
                            userErrorAnswerDatas: userErrorAnswerDatas,
                            userAnswerCardId: userAnswerCardId
                        }
                    }).then(data => {

                        Toast.hide();
                        Toast.info(data.msg);
                        if (data.success) {
                            navigation.getParam("back", () => { })();
                            navigation.goBack();
                        }
                    })
                }
            }
        ])
    }

    initPracticeNodes = () => {
        const { navigation } = this.props;
        api({
            url: "/practice/initPracticeNodes"
        }).then(data => {

            const projects = data.result;
            const sdata = navigation.getParam("data", null);
            if (sdata) {
                this.setState({
                    projects: projects,
                    firstValue: sdata.ieltsId,
                    secendValue: sdata.setId,
                    thirdValue: sdata.examPartition,
                    userAnswerCardId: sdata.userAnswerCardId
                });
            } else {
                this.setState({
                    projects: projects,
                    firstValue: projects[0].value,
                    secendValue: projects[0].childNode[0].value,
                    thirdValue: projects[0].childNode[0].childNode[0].value,
                    
                });
            }


            this.loadSections();



        })
    }

    loadSections = () => {
        const { firstValue, secendValue, thirdValue, userAnswerCardId } = this.state;
        api({
            url: "/examRecord/getAnswerCard",
            method: "POST",
            body: {
                ieltsId: firstValue,
                examPartition: thirdValue,
                setId: secendValue,
                userAnswerCardId: userAnswerCardId
            }
        }).then(data => {
            const selectNoMap = {};
            const startMap = {};
            const notesMap = {};
            const vos = data.result.answerCardSectionVos;
            vos.forEach((vo, i) => {
                const no = {};
                const start = {};
                const note = {};
                vo.answerCardDataVoList.forEach(item => {
                    if (item.errorStatus == 1) {
                        no[item.qNo] = true;
                    }
                    if (item.pointStatus == 1) {
                        start[item.qNo] = true;
                    }
                    if (item.notes) {
                        note[item.qNo] = item.notes;
                    }
                });
                selectNoMap[`s-${i}`] = no;
                startMap[`s-${i}`] = start;
                notesMap[`s-${i}`] = note;
            })
            this.setState({
                answerAnalysisVo: data.result.answerAnalysisVo,
                sections: vos,
                selectNoMap: selectNoMap,
                startMap: startMap,
                notesMap: notesMap,
                cardId: data.result.cardId
            })
        })
    }

    render() {
        const {
            projects, firstValue,
            secendValue, thirdValue,
            show, dataList, dataType,
            sections, sectionMap,
            selectNoMap, startMap,
            showBzModal, notesMap,
            currentInfo, noteText,
            isOpenDetail
        } = this.state;

        const aav = this.state.answerAnalysisVo;
        if (projects.length == 0) {
            return (
                <View></View>
            )
        }


        const firstData = firstValue == null ? projects[0] : projects.find(item => item.value == firstValue);
        const secendProjects = firstData.childNode;
        const secendData = secendValue == null ? secendProjects[0] : secendProjects.find(item => item.value == secendValue);
        const thirdProjects = secendData.childNode;
        const thirdData = thirdValue == null ? thirdProjects[0] : thirdProjects.find(item => item.value == thirdValue);

        const DataModal = (dataList, dataType, show) => {
            if (!show) {
                return null;
            }
            return (<View style={{
                position: "absolute",
                height: window.height,
                width: "100%",
                backgroundColor: "rgba(0,0,0,0.5)",
                top: 40
            }}>

                <View style={{
                    maxHeight: 350,
                    backgroundColor: "#fff",
                    // padding: 20,
                    paddingTop: 0,
                    paddingBottom: 20
                }}>
                    <ScrollView>
                        {
                            dataList.map((item, index) => {
                                return (
                                    <TouchableOpacity
                                        key={index}
                                        style={{
                                            borderBottomColor: "#E6E6E6",
                                            borderBottomWidth: 1,
                                            height: 50,
                                            justifyContent: "center",
                                            width: window.width - 40,
                                            marginLeft: 20,
                                            paddingLeft: 10
                                        }}
                                        onPress={() => {
                                            const data = {
                                                show: false
                                            }

                                            if (dataType == "first") {
                                                data.thirdValue = item.childNode[0].childNode[0].value;
                                                data.secendValue = item.childNode[0].value;
                                                data.firstValue = item.value;
                                            }
                                            else if (dataType == "secend") {
                                                data.thirdValue = item.childNode[0].value;
                                                data.secendValue = item.value;

                                            }
                                            else if (dataType == "third") {
                                                data.thirdValue = item.value;
                                            }
                                            data.userAnswerCardId = null;
                                            this.setState(data);
                                            setTimeout(() => {
                                                this.loadSections();
                                            }, 1)

                                        }}
                                    >
                                        <Text style={{
                                            fontSize: 14,
                                            color: "#1E1F44"
                                        }}>{
                                                item.title
                                            }</Text>
                                    </TouchableOpacity>
                                )
                            })
                        }
                    </ScrollView>
                </View>

            </View>)

        }


        const BizModal = showBzModal ? (
            <Modal
                visible={showBzModal}
                transparent={true}

                onRequestClose={() => {
                    this.setState({
                        showBzModal: false
                    });
                }}
                onDismiss={() => {
                    this.setState({
                        showBzModal: false
                    });
                }}
            >


                <View style={{
                    flex: 1,
                    backgroundColor: "rgba(0,0,0,0.5)",
                    alignItems: "center",
                    // justifyContent: "center"
                }}>
                    <View style={{


                        backgroundColor: "#F6F6F6",
                        borderRadius: 13,
                        padding: 20,
                        paddingBottom: 0,
                        marginTop: "40%",
                        // height: 150,
                        width: "80%"
                    }}>

                        <TextInput
                            autoFocus={true}
                            value={noteText}
                            multiline={true}
                            textAlignVertical={"top"}
                            style={{
                                width: "100%",
                                height: 100,
                                backgroundColor: "#fff"
                            }}
                            onChangeText={(value) => {
                                this.setState({
                                    noteText: value
                                })
                            }}
                        >

                        </TextInput>

                        <View style={{
                            flexDirection: "row"
                        }}>
                            <View
                                style={{
                                    width: "50%",
                                    height: 50,
                                    justifyContent: "center"

                                }}
                            >
                                <TouchableOpacity onPress={() => {
                                    const { currentInfo, currentSindex } = this.state;
                                    const note = notesMap[`s-${currentSindex}`] ? notesMap[`s-${currentSindex}`] : {};
                                    note[currentInfo] = null;
                                    notesMap[`s-${currentSindex}`] = note;
                                    this.setState({
                                        notesMap: notesMap,
                                        showBzModal: false,
                                        currentInfo: null,
                                        noteText: ""
                                    });

                                }}>
                                    <Text
                                        style={{
                                            fontSize: 14,
                                            color: "#808080"
                                        }}
                                    >删除</Text>
                                </TouchableOpacity>
                            </View>
                            <View
                                style={{
                                    width: "50%",
                                    alignItems: "flex-end",
                                    height: 50,
                                    justifyContent: "center"

                                }}
                            >
                                <TouchableOpacity
                                    onPress={() => {
                                        // if(!noteText){
                                        //     Toast.info("内容不能为空");
                                        //     return;
                                        // }
                                        const { currentInfo, currentSindex } = this.state;
                                        const note = notesMap[`s-${currentSindex}`] ? notesMap[`s-${currentSindex}`] : {};
                                        note[currentInfo] = noteText;
                                        notesMap[`s-${currentSindex}`] = note;
                                        this.setState({
                                            notesMap: notesMap,
                                            showBzModal: false,
                                            noteText: "",
                                            currentInfo: null

                                        });
                                    }}
                                >
                                    <Text
                                        style={{
                                            color: "#1E1F44",
                                            fontSize: 14
                                        }}
                                    >保存</Text>
                                </TouchableOpacity>
                            </View>
                        </View>
                    </View>

                </View>



            </Modal>
        ) : null;

        return (
            <View style={{ flex: 1 }}>
                <View style={{
                    height: 40,
                    backgroundColor: "#fff",
                    paddingLeft: 20,
                    paddingRight: 20,
                    flexDirection: "row",
                    borderBottomColor: "#E6E6E6",
                    borderBottomWidth: 0.5
                }}>
                    <TouchableOpacity
                        style={{
                            width: "33.333%",
                            height: 40,
                            alignContent: "center"

                        }}
                        onPress={() => {
                            this.setState({
                                show: dataType == "first" ? !show : true,
                                dataList: projects,
                                dataType: "first"
                            })
                        }}
                    >
                        <View style={{
                            height: 20,
                            borderLeftWidth: 1,
                            borderLeftColor: "#E6E6E6",
                            flexDirection: "row"
                        }}>
                            <View style={{
                                width: "70%",
                                paddingLeft: 10,

                            }}>
                                <Text
                                    numberOfLines={1}
                                    style={{
                                        fontSize: 14,
                                        color: "#1E1F44",

                                    }}>{
                                        firstData ? firstData.title : ""
                                    }</Text>
                            </View>

                            <View style={{
                                width: "30%",
                                alignItems: "flex-end",
                                paddingRight: 10,
                                height: 20,
                                // backgroundColor:"#ccc",
                                justifyContent: "center"

                            }}>
                                {
                                    (dataType == "first" && show) ? (
                                        <Image source={require("./img/a-down.png")} style={{
                                            width: 15,
                                            height: 15,

                                        }}></Image>) : (<Image source={require("./img/a-up.png")} style={{
                                            width: 15,
                                            height: 15,

                                        }}></Image>)
                                }


                            </View>
                        </View>
                    </TouchableOpacity>
                    <TouchableOpacity
                        style={{
                            width: "33.333%"
                        }}
                        onPress={() => {
                            this.setState({
                                show: dataType == "secend" ? !show : true,
                                dataList: secendProjects,
                                dataType: "secend"
                            })
                        }}
                    >
                        <View style={{
                            height: 20,
                            borderLeftWidth: 1,
                            borderLeftColor: "#E6E6E6",
                            flexDirection: "row"
                        }}>
                            <View style={{
                                width: "50%",
                                paddingLeft: 10,

                            }}>
                                <Text style={{
                                    fontSize: 14,
                                    color: "#1E1F44",

                                }}>
                                    {
                                        secendData ? secendData.title : ""
                                    }
                                </Text>
                            </View>

                            <View style={{
                                width: "50%",
                                alignItems: "flex-end",
                                paddingRight: 10,
                                height: 20,
                                // backgroundColor:"#ccc",
                                justifyContent: "center"

                            }}>
                                {
                                    (dataType == "secend" && show) ? (
                                        <Image source={require("./img/a-down.png")} style={{
                                            width: 15,
                                            height: 15,

                                        }}></Image>) : (<Image source={require("./img/a-up.png")} style={{
                                            width: 15,
                                            height: 15,

                                        }}></Image>)
                                }

                            </View>
                        </View>
                    </TouchableOpacity>
                    <TouchableOpacity
                        activeOpacity={0.5}
                        onPress={() => {
                            this.setState({
                                show: dataType == "third" ? !show : true,
                                dataList: thirdProjects,
                                dataType: "third"
                            })
                        }}
                        style={{
                            width: "33.333%"
                        }}
                    >
                        <View style={{
                            height: 20,
                            borderLeftWidth: 1,
                            borderLeftColor: "#E6E6E6",
                            flexDirection: "row",
                            borderRightWidth: 1,
                            borderRightColor: "#E6E6E6",
                        }}>
                            <View style={{
                                width: "70%",
                                paddingLeft: 10,

                            }}>
                                <Text style={{
                                    fontSize: 14,
                                    color: "#1E1F44",

                                }}>
                                    {
                                        thirdData ? thirdData.title : ""
                                    }
                                </Text>
                            </View>

                            <View style={{
                                width: "30%",
                                alignItems: "flex-end",
                                paddingRight: 10,
                                height: 20,
                                // backgroundColor:"#ccc",
                                justifyContent: "center"

                            }}>
                                {
                                    (dataType == "third" && show) ? (
                                        <Image source={require("./img/a-down.png")} style={{
                                            width: 15,
                                            height: 15,

                                        }}></Image>) : (<Image source={require("./img/a-up.png")} style={{
                                            width: 15,
                                            height: 15,

                                        }}></Image>)
                                }

                            </View>
                        </View>
                    </TouchableOpacity>
                </View>

                <ScrollView>
                    {
                        sections.map((item, i) => {



                            const isOpen = sectionMap[`s-${i}`] ? true : false;
                            const start = startMap[`s-${i}`] ? startMap[`s-${i}`] : {};
                            const startNum = Object.keys(start).filter(d => start[d] == true).length;
                            const notes = notesMap[`s-${i}`] ? notesMap[`s-${i}`] : {};
                            const noteNum = Object.keys(notes).filter(d => notes[d]).length;
                            const selectNo = selectNoMap[`s-${i}`] ? selectNoMap[`s-${i}`] : {};
                            const selectNoNum = Object.keys(selectNo).filter(d => selectNo[d]).length;

                            // let {
                            //     no,
                            //     start,
                            //     note,
                            //     info
                            // } = this.state.dataMap[`d-${i}`];




                            return (
                                <View key={i}>
                                    <TouchableOpacity

                                        activeOpacity={0.7}
                                        style={{
                                            height: 60,
                                            borderBottomColor: "#e6e6e6",
                                            borderBottomWidth: 1,
                                            flexDirection: "row"
                                        }}
                                        onPress={() => {
                                            Object.keys(sectionMap).forEach(k => {
                                                sectionMap[k] = false;
                                            })
                                            sectionMap[`s-${i}`] = !isOpen;

                                            this.setState({
                                                sectionMap: sectionMap
                                            })
                                        }}
                                    >
                                        <View style={{
                                            width: "50%",
                                            height: 60,
                                            justifyContent: "center",
                                            paddingLeft: 20
                                        }}>
                                            <Text
                                                style={{
                                                    fontSize: 16,
                                                    color: isOpen ? "#1E1F44" : "#969EB0"
                                                }}>{item.sectionName}</Text>
                                        </View>
                                        <View style={{
                                            width: "50%",
                                            height: 60,
                                            flexDirection: "row-reverse",
                                            alignItems: "flex-end",


                                        }}>
                                            <View
                                                style={{
                                                    height: 60,
                                                    justifyContent: "center",
                                                    marginRight: 20
                                                }}

                                            >
                                                {
                                                    isOpen ? (<Image
                                                        source={require("./img/a-up.png")}
                                                        style={{
                                                            width: 15,
                                                            height: 15
                                                        }}
                                                    ></Image>) : (<Image
                                                        source={require("./img/a-down.png")}
                                                        style={{
                                                            width: 15,
                                                            height: 15
                                                        }}
                                                    ></Image>)
                                                }

                                            </View>

                                            <View
                                                style={{
                                                    height: 60,
                                                    justifyContent: "center",
                                                    marginRight: 5

                                                }}
                                            >
                                                <View style={{
                                                    width: 40,
                                                    height: 20,
                                                    flexDirection: "row",
                                                    alignItems: "center",

                                                }}>
                                                    {
                                                        (noteNum > 0) ? (<Image
                                                            source={require("./img/info-i.png")}
                                                            style={{
                                                                width: 15,
                                                                height: 15
                                                            }}
                                                        ></Image>) : (<Image
                                                            source={require("./img/info.png")}
                                                            style={{
                                                                width: 15,
                                                                height: 15
                                                            }}
                                                        ></Image>)
                                                    }


                                                    <Text
                                                        style={{
                                                            color: "#1E1F44",
                                                            paddingLeft: 5
                                                        }}
                                                    >{noteNum > 0 ? noteNum : ""}</Text>
                                                </View>
                                            </View>
                                            <View
                                                style={{
                                                    height: 60,
                                                    justifyContent: "center",
                                                    marginRight: 5

                                                }}
                                            >
                                                <View style={{
                                                    width: 40,
                                                    height: 20,
                                                    flexDirection: "row",
                                                    alignItems: "center",

                                                }}>
                                                    {
                                                        startNum > 0 ? (<Image
                                                            source={require("./img/start-d.png")}
                                                            style={{
                                                                width: 15,
                                                                height: 15
                                                            }}
                                                        ></Image>) : (<Image
                                                            source={require("./img/start.png")}
                                                            style={{
                                                                width: 15,
                                                                height: 15
                                                            }}
                                                        ></Image>)
                                                    }


                                                    <Text
                                                        style={{
                                                            color: "#1E1F44",
                                                            paddingLeft: 5
                                                        }}
                                                    >{startNum > 0 ? startNum : ""}</Text>
                                                </View>
                                            </View>
                                            <View
                                                style={{
                                                    height: 60,
                                                    justifyContent: "center",
                                                    marginRight: 5

                                                }}
                                            >
                                                <View style={{
                                                    width: 60,
                                                    height: 20,
                                                    flexDirection: "row",
                                                    alignItems: "center",

                                                }}>
                                                    <Text
                                                        style={{
                                                            color: "#1E1F44",
                                                            paddingLeft: 5,
                                                        }}
                                                    >{selectNoNum > 0 ? `错 ${selectNoNum}` : ""}</Text>
                                                </View>
                                            </View>


                                        </View>

                                    </TouchableOpacity>
                                    {
                                        item.answerCardDataVoList.map((vo, j) => {
                                            const isSelectNo = selectNo[`${vo.qNo}`] ? true : false;
                                            const isSelectStart = start[`${vo.qNo}`] ? true : false;
                                            const isSelectInfo = notes[`${vo.qNo}`] ? true : false;
                                            return (
                                                <View
                                                    key={j}
                                                    style={{
                                                        flexDirection: "row",
                                                        height: 60,
                                                        display: isOpen ? "flex" : "none"
                                                    }}
                                                >
                                                    <View
                                                        style={{
                                                            width: 40,
                                                            height: 60,
                                                            justifyContent: "center",
                                                            paddingLeft: 20
                                                        }}
                                                    >
                                                        <Text
                                                            style={{
                                                                color: "#9B9B9B"
                                                            }}
                                                        >{vo.qNo}</Text>
                                                    </View>
                                                    <View
                                                        style={{
                                                            width: window.width - 60,
                                                            height: 60,
                                                            // justifyContent: "center",
                                                            borderBottomColor: "#e6e6e6",
                                                            borderBottomWidth: 1,
                                                            flexDirection: "row"

                                                        }}
                                                    >
                                                        <TouchableOpacity
                                                            style={{
                                                                width: "80%",
                                                                height: 60,
                                                                justifyContent: "center",

                                                            }}
                                                            onPress={() => {
                                                                selectNo[vo.qNo] = !isSelectNo;
                                                                selectNoMap[`s-${i}`] = selectNo;
                                                                this.setState({
                                                                    selectNoMap: selectNoMap
                                                                })
                                                            }}
                                                        >
                                                            <View style={{
                                                                height: 45,
                                                                justifyContent: "center",
                                                                backgroundColor: isSelectNo ? "#FFD089" : "#f5f5f5",
                                                                paddingLeft: 10,
                                                                borderRadius: 4,
                                                                width: "90%"
                                                            }}>
                                                                <Text numberOfLines={1}>{vo.qKey}</Text>
                                                            </View>

                                                        </TouchableOpacity>
                                                        <View
                                                            style={{
                                                                width: "20%",
                                                                flexDirection: "row",
                                                                height: 60
                                                            }}
                                                        >
                                                            <TouchableOpacity
                                                                style={{
                                                                    width: "50%",
                                                                    height: 60,
                                                                    justifyContent: "center"
                                                                }}
                                                                onPress={() => {
                                                                    start[`${vo.qNo}`] = !isSelectStart;
                                                                    startMap[`s-${i}`] = start;
                                                                    this.setState({
                                                                        startMap: startMap
                                                                    })
                                                                }}
                                                            >
                                                                {
                                                                    isSelectStart ? (<Image
                                                                        source={require("./img/start-d.png")}
                                                                        style={{
                                                                            width: 15,
                                                                            height: 15
                                                                        }}
                                                                    ></Image>) : (<Image
                                                                        source={require("./img/start-i.png")}
                                                                        style={{
                                                                            width: 15,
                                                                            height: 15
                                                                        }}
                                                                    ></Image>)
                                                                }

                                                            </TouchableOpacity>
                                                            <TouchableOpacity
                                                                onPress={() => {
                                                                    this.setState({
                                                                        showBzModal: true,
                                                                        currentInfo: vo.qNo,
                                                                        noteText: notes[`${vo.qNo}`],
                                                                        currentSindex: i
                                                                    })
                                                                }}
                                                                style={{
                                                                    width: "50%",
                                                                    height: 60,
                                                                    justifyContent: "center"
                                                                }}
                                                            >
                                                                {
                                                                    (isSelectInfo || currentInfo == vo.qNo) ? (<Image
                                                                        source={require("./img/info-i.png")}
                                                                        style={{
                                                                            width: 15,
                                                                            height: 15
                                                                        }}
                                                                    ></Image>) : (<Image
                                                                        source={require("./img/info-d.png")}
                                                                        style={{
                                                                            width: 15,
                                                                            height: 15
                                                                        }}
                                                                    ></Image>)
                                                                }
                                                            </TouchableOpacity>
                                                        </View>
                                                    </View>

                                                </View>
                                            )
                                        })
                                    }
                                </View>
                            )
                        })
                    }

                    {
                        aav ? (
                            <View>
                                <View style={{
                                    padding: 15, borderBottomColor: "#e6e6e6",
                                    borderBottomWidth: 1,
                                }}>
                                    <Flex>
                                        <Flex.Item>
                                            <View>
                                                <View style={{
                                                    height: 25,
                                                    // justifyContent: "center",
                                                    marginBottom: 8,
                                                    
                                                }}>
                                                    <Text style={{
                                                        color: "#000000",
                                                        fontSize: 14,
                                                    }}>本次答题分析</Text>
                                                </View>
                                                <View>
                                                    <Text
                                                        style={{
                                                            color: "#697388",
                                                            fontSize: 12
                                                        }}
                                                    >
                                                        {aav.exmaDate}
                                                    </Text>
                                                </View>

                                            </View>

                                        </Flex.Item>
                                        <Flex.Item>
                                            <View
                                                style={{
                                                    paddingLeft: 40
                                                }}
                                            >
                                                <View style={{
                                                    height: 25,
                                                    justifyContent: "center",
                                                    marginBottom: 10,
                                                   
                                                }}>
                                                    <Text style={{
                                                        fontSize: 10,
                                                        color: "#697388"
                                                    }}>
                                                        本次得分
                                                </Text>
                                                </View>
                                                <View>
                                                    <Text style={{
                                                        fontSize: 16,
                                                        color: "#1E1F44"
                                                    }}>{aav.score}</Text>
                                                </View>

                                            </View>

                                        </Flex.Item>
                                        <Flex.Item>
                                            <View
                                                style={{
                                                    paddingLeft: 40
                                                }}
                                            >
                                                <View style={{
                                                    height: 25,
                                                    justifyContent: "center",
                                                    marginBottom: 10,
                                                    
                                                }}>
                                                    <Text style={{
                                                        fontSize: 10,
                                                        color: "#697388"
                                                    }}>正确数</Text>
                                                </View>
                                                <View>
                                                    <Text style={{
                                                        fontSize: 16,
                                                        color: "#1E1F44"
                                                    }}>{aav.correctCount}</Text>
                                                </View>

                                            </View>

                                        </Flex.Item>
                                        <Flex.Item>
                                            <View

                                                style={{
                                                    paddingLeft: 40
                                                }}
                                            >
                                                <View style={{
                                                    height: 25,
                                                    justifyContent: "center",
                                                   
                                                    marginBottom: 10
                                                }}>
                                                    <Text style={{
                                                        fontSize: 10,
                                                        color: "#697388"
                                                    }}>错题数</Text>
                                                </View>
                                                <View>
                                                    <Text style={{
                                                        fontSize: 16,
                                                        color: "#1E1F44"
                                                    }}>{aav.errorCount}</Text>
                                                </View>
                                            </View>

                                        </Flex.Item>
                                    </Flex>
                                </View>
                                <View style={{
                                    borderBottomColor: "#e6e6e6",
                                    borderBottomWidth: 1,
                                }}>


                                    <TouchableOpacity
                                        style={{

                                            height: 60,
                                            position: "relative"
                                        }}
                                        activeOpacity={1}
                                        onPress={() => {
                                            this.setState({
                                                isOpenDetail: !isOpenDetail
                                            })
                                        }}
                                    >
                                        <View style={{
                                            height: 60,
                                            justifyContent: "center",
                                            paddingLeft: 15
                                        }}>
                                            <Text
                                                style={{
                                                    fontSize: 12,
                                                    color: "#1E1F44"
                                                }}
                                            >详细数据</Text>
                                        </View>
                                        <View style={{
                                            height: 60,
                                            justifyContent: "center",
                                            right: 0,
                                            paddingRight: 20,
                                            position: "absolute"
                                        }}>
                                            {
                                                isOpenDetail ? (<Image
                                                    source={require("./img/a-up.png")}
                                                    style={{
                                                        width: 15,
                                                        height: 15
                                                    }}
                                                ></Image>) : (<Image
                                                    source={require("./img/a-down.png")}
                                                    style={{
                                                        width: 15,
                                                        height: 15
                                                    }}
                                                ></Image>)
                                            }
                                        </View>
                                    </TouchableOpacity>
                                    <View style={{
                                        paddingLeft: 15,
                                        paddingRight: 15,
                                        display: isOpenDetail ? "flex" : "none"
                                    }}>
                                        {aav.answerAnalysisInfoVos.map((item, index) => {
                                            return (
                                                <View key={index} style={{ marginBottom: 15, flexDirection: "row" }}>
                                                    <View style={{ width: 100 }}>
                                                        <Text style={{ fontSize: 12, color: "#000" }}>
                                                            {item.categoryName}
                                                        </Text>
                                                    </View>
                                                    <View style={{
                                                        width: window.width - 30 - 100 - 50,
                                                        alignItems: "center",
                                                        height: 12,
                                                        justifyContent: "center"
                                                    }}>
                                                        <View style={{
                                                            width: "100%",
                                                            backgroundColor: "#f6f6f6",
                                                            borderRadius: 2,
                                                            height: 8
                                                        }}>
                                                            <View
                                                                style={{
                                                                    width: `${item.correctCount > 0 ? (item.correctCount / item.total)*100 : 0}%`,
                                                                    backgroundColor: thirdValue == 1?"#FFD089":"#9AC4FF",
                                                                    borderRadius: 2,
                                                                    height: 8
                                                                }}
                                                            >

                                                            </View>
                                                        </View>
                                                    </View>
                                                    <View style={{ width: 50 }}>
                                                        <Text style={{ fontSize: 12, color: "#000", textAlign: "right" }}>{item.correctCount}/{item.total}</Text>
                                                    </View>
                                                </View>
                                            )
                                        })}

                                    </View>
                                </View>

                            </View>
                        ) : null
                    }

                    <View
                        style={{
                            flex: 1,
                            height: 60
                        }}
                    >

                    </View>
                </ScrollView>
                {DataModal(dataList, dataType, show)}

                {BizModal}
            </View>
        )
    }
}